<template>
	<view class="container">
		<view class="top">
			<view class="text">发放至</view>
			<input class="input1" type="text" placeholder="请输入手机号" v-model="phone" @input="inputphone"/>
		</view>
		<view class="bottom" @click="send" :class="{'bg':flag}">确定发放</view>
	</view>
</template>

<script>
	import {applyCard} from "@/api/product";
	export default {
		data(){
			return {
				list:[],
				phone:'',
				flag:false,
				number:''
			}
		},
		onLoad(e) {
			this.list=JSON.parse(e.list)
			this.number=e.number
			console.log(this.list);
		},
		methods:{
			inputphone(){
				let reg = /^1(3[0-9]|4[5,7]|5[0,1,2,3,5,6,7,8,9]|6[2,5,6,7]|7[0,1,7,8]|8[0-9]|9[1,8,9])\d{8}$/
				    // return reg.test(phoneNum);
					if(reg.test(this.phone)){
						this.flag=true;
						console.log(this.flag)
					}
			},		
			send(){
				if(this.flag==true){
					this.$post(applyCard,{mobile:this.phone,num:this.number}).then(res=>{
						console.log(res);
						if(res.code!=200){
							uni.showToast({
								title:res.message,
								icon:"none"
							})
						}
						if(res.code==200){
							uni.showToast({
								title:res.message,
								
							})
						}
					})
				}
				
			}
			
		}
	}
</script>

<style>
	.container{
		background-color: #F2F2F2;
	}
	.top{
		width: 690rpx;
		height: 80rpx;
		margin: 0 auto;
		border-bottom: 1px solid #707070;
		display: flex;
		margin-top: 80rpx;
	}
	.text{
		font-size: 28rpx;
		font-weight: 400;
		line-height: 40rpx;
		color: #333333;
		margin-right: 84rpx;
	}
	.input1{
		font-size: 28rpx;
		font-weight: 300;
		line-height: 40rpx;
		color: #333333;
	}
	.bottom{
		width: 690rpx;
		height: 80rpx;
		margin: 0 auto;
		margin-top: 60rpx;
		text-align: center;
		background: #D9D9D9;
		border-radius: 8rpx;
		line-height: 80rpx;
		font-size: 36rpx;
		font-weight: 400;
		color: #343434;
	}
	.bg{
		background-color: #FC9F56;
		color: #FFFFFF;
	}
</style>
